<template>
  <v-container fluid fill-height>
    <v-layout align-center justify-center>
      <v-flex xs12 sm8 md4>
        <v-card class="elevation-12">
          <v-toolbar dark color="primary">
            <v-toolbar-title>Login form</v-toolbar-title>
            <v-spacer></v-spacer>
            <v-tooltip bottom>
              <template v-slot:activator="{ on }">
                <v-btn :href="source" icon large target="_blank" v-on="on">
                  <v-icon large>code</v-icon>
                </v-btn>
              </template>
              <span>Source</span>
            </v-tooltip>
            <v-tooltip right>
              <template v-slot:activator="{ on }">
                <v-btn
                  icon
                  large
                  href="https://codepen.io/johnjleider/pen/wyYVVj"
                  target="_blank"
                  v-on="on"
                >
                  <v-icon large>mdi-codepen</v-icon>
                </v-btn>
              </template>
              <span>Codepen</span>
            </v-tooltip>
          </v-toolbar>
          <v-card-text>
            <v-form>
              <v-text-field
                prepend-icon="mdi-account"
                name="login"
                label="Login"
                type="text"
                v-model="username"
              ></v-text-field>
              <v-text-field
                id="password"
                prepend-icon="mdi-lock"
                name="password"
                label="Password"
                type="password" 
                v-model="password"
              ></v-text-field>
            </v-form>
          </v-card-text>
          <v-card-actions>
            <v-spacer></v-spacer>
            <v-btn color="primary" @click="login">Login</v-btn>
          </v-card-actions>
        </v-card>
      </v-flex>
    </v-layout>
  </v-container>
</template>


// import http from '../http/http'
// export default {
//   data: () => ({
//     drawer: null,
//     username: 'seveniruby@ceshiren.com',
//     password: '1234567',
//   }),
//   props: {
//     source: String,
//   },
//   methods: {
//       login: function(){
//           console.log(1)
//           console.log({username: this.username, password: this.password}) 
//           http.request({
//               method: 'post',
//               url: '/login',
//               data: {username: this.username, password: this.password}
//           }).then( response => {
//               if(response.data.errcode===0){
//                   console.log(response.data)
//                   this.$router.push('/dashboard/testcase')
//               }
//           })

//       }
//   }
// };


<script>
import http from '../http/http'
export default {
  
  data:()=>({
    username: "yujin@qq.com",
    password: "123456"
  }),
  methods:{
    login:function(){
      console.log(this.username)
      console.log(this.password)
      http.request({
        method:"post",
        url:"/login",
        data:{username:this.username,password:this.password}
      }).then(response=>{
        if (response.data.errcode === 0 )
          console.log(response.data.msg)
          // 路由跳转
          this.$router.push("/testcase")
      })
    }
  }
}
</script>